.top{
    height: 650px;
    background: gainsboro;
    background: url(../img/main.jpg) no-repeat center;
}
.menu {
    position: fixed;
    width: 100%;
    top: 0;
    font-size: 0;
    padding: 0;
    height: 50px;
    padding-left: 65%;
    /*background-color: #00a2ca;*/
    background:rgba(0, 0, 0, 0.3);
}


.menubar	{
    margin: 0 auto;
    position: absolute;
    list-style-type: none;
    width: 70%;
    overflow-y: auto;
    float: right;
}
.menubar li	{
    padding:0px 5px;
    display:inline-block;
    cursor: pointer;
    line-height: 50px;
    margin-left: 20px;
}
.menubar li:hover	{
    /*background-color:#0095bb;*/
    background-color:ghostwhite;
}

.menubar a	{
    display: block;
    height: 50px;
    font-family: "微软雅黑","Microsoft Yahei","Hiragino Sans GB",tahoma,arial,"宋体" ;
    font-size: 15px;
    text-align: center;
    text-decoration: none;
    color: #fff;
}



/*---top----------------------------------------------------------------------*/
.top_block{
    width: 50%;
    height: 100%;
    float: left;

}
.top_poem{
    margin-top: 160px;
    margin-left: 90px;
    /*width: 350px;*/
    height: 350px;

}
.top_poem p{
    font-size: 35px;
    color: #fff;
    font-family:STXingkai ;
}

.top_right{
    width: 500px;
    height: 500px;
    background: #dc3545;
}
/*---end   top----------------------------------------------------------------------*/

/*tip*/
.top_bottom{
    height: 60px;
    width: 100%;
    background: ghostwhite;
}
.top_bottom{
    font-size: 35px;
    color: grey;
    font-family:LiSu ;
    text-align: center;
    text-decoration: none;
    line-height:60px;
}

/*1随机写诗模块-----------------------------------------------------------------------*/
.content_div1{
    height: 550px;
    background-color: #ebebeb;
}
.content_div1_head{
    height: 50px;
    width: 100%;
    background:rgba(0, 0, 0, 0.3);
    font-size: 30px;
    color: white;
    font-family:LiSu ;
    text-align: center;
    text-decoration: none;
    line-height:50px;
    float: left;
}
/*2随机写诗左块---------------------------------------------------------------*/
.content_left{
    width: 40%;
    height: 500px;
    float: left;

}
.cue1{
    width: 200px;
    height: 50px;
    margin-left: 150px;
    margin-top: 200px;
    /*background-color: #d0e9c6;*/

    font-size: 30px;
    color: grey;
    font-family:LiSu ;
    text-align: center;
    text-decoration: none;
    line-height:50px;
    float: left;
}
.butt_div1{
    width: 100px;
    height: 100px;
    margin-left: 90px;
    margin-top: 180px;
    /*background-color: #d0e9c6;*/
    float: left;
}

/*随机写诗右-----------------------------------------------*/
.content_right{
    width: 60%;
    height: 500px;
    float: left;
    background-color: #d0e9c6;
}

body{
    border:0;
    padding:0;
    margin:0;
}
.poem_center{
    width:80%;
    height:400px;
    margin-top: 50px;
    margin-left: 10%;
    line-height:40px;
    background-color:ghostwhite;
    text-align:center;
    font-size: 21px;
    float: left;
    /*color: white;*/
    font-family:LiSu ;
}

.poem_center ul{
    display:inline;
    list-style:none;
    text-align:center;
}
/* end   随即写诗---------------------------------------------------------*/


/*start 藏头诗+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
.butt_div2{
    width: 100px;
    height: 290px;
    margin-left: 20px;
    margin-top: 100px;
    /*background-color: #d0e9c6;*/
    float: left;
}
.input_div2{
    width: 220px;
    height: 50px;
    margin-left: 50px;
    margin-top: 200px;
    background-color: #d0e9c6;

    font-size: 22px;
    color: grey;
    font-family:LiSu ;
    text-align: center;
    text-decoration: none;
    line-height:50px;
    float: left;
}
.cue2{
    width: 100px;
    height: 250px;
    margin-left: 50px;
    margin-top: 100px;
    /*background-color: #d0e9c6;*/

    font-size: 40px;
    color: grey;
    font-family:LiSu ;
    text-align: center;
    text-decoration: none;
    line-height:50px;
    float: left;
}










/*底部*/
/*底部======================================================*/
.bottom{
    /*position:absolute;*/
    bottom:0;
    /*background-color: #f2f2f2;*/
    background-color: #0b0b0b;
    width: 100%;
    height: 35px;
    /*font-size: 20px;*/
    color: grey;
    /*font-family:LiSu ;*/
    text-align: center;
    text-decoration: none;
    line-height:35px;
}

/*按钮-------------------------------------------*/
.butt {
    cursor:pointer;
    position: relative;
    font-size: 0;
    width: 100px;
    height: 100px;
    text-align: center;
    margin-right: 50px;
    border-radius: 50%;
    border:none;
    box-shadow: 0 2px 5px rgba(0,0,0,.4);
    background: -webkit-linear-gradient(top,#fff,#d5dbe1);
    background: -moz-linear-gradient(top,#fff,#d5dbe1);
    background: -ms-linear-gradient(top,#fff,#d5dbe1);
    background: -o-linear-gradient(top,#fff,#d5dbe1);
linear-gradient(top,#fff,#d5dbe1);
    -webkit-transition: all .13s ease-out;
    -moz-transition: all .13s ease-out;
    -o-transition: all .13s ease-out;
    transition: all .13s ease-out;
}
.butt:after {
    display: inline-block;
    font-family: 'icomoon';
    font-size: 24px;
    color: #bdc0c1;
    content: attr(data-icon);
    speak: none;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
    width: 64px;
    line-height: 64px;
    margin: 10px;
    border-radius: 32px;
    border: 1px solid #efefef;
    box-shadow: -1px 0 0 #dbdcdd,1px 0 0 #dbdcdd,0 1px 0 #d0d1d2,0 0 8px #fff;
    background: -webkit-linear-gradient(top left,#fcfcfc 50%,#dfe4e8);
}
.butt:first-child:after {
    content: "诗";
}
.butt:last-child:after {
    /*content: "\25";*/
    content: "诗";
}
.butt:hover:after {
    color: #19a6e4;
    box-shadow: 0 1px 3px #d7d8d9 inset;
    background: -webkit-radial-gradient(#dbeef8 ,#f2f4f6 50%);
}
.butt:active {
    top: 3px;
    box-shadow: 0 1px 3px #d7d8d9 inset;
}
